<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>DataGrid Complex Toolbar - jQuery EasyUI Demo</title>
    <link rel="stylesheet" type="text/css" href="/easyui/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="/easyui/themes/icon.css">
    <link rel="stylesheet" type="text/css" href="/easyui/demo.css">
    <script type="text/javascript" src="/easyui/jquery.min.js"></script>
    <script type="text/javascript" src="/easyui/jquery.easyui.min.js"></script>
</head>
<body>

<table id="dg" class="easyui-datagrid" style="width:700px;height:250px"
       data-options="rownumbers:true,singleSelect:true,url:'datagrid_data1.json',method:'get',toolbar:'#tb'">
</table>

<div id="tb" style="padding:2px 5px;">
    推送消息: <input id="input_message" type="text" style="width:300px">
    <a id="btn_send" href="#" class="easyui-linkbutton" iconCls="icon-search">全员发送</a>
</div>

<div id="win"></div>

</body>

<script>

    function formatDateTime(inputTime) {
        var date = new Date(inputTime);
        var y = date.getFullYear();
        var m = date.getMonth() + 1;
        m = m < 10 ? ('0' + m) : m;
        var d = date.getDate();
        d = d < 10 ? ('0' + d) : d;
        var h = date.getHours();
        h = h < 10 ? ('0' + h) : h;
        var minute = date.getMinutes();
        var second = date.getSeconds();
        minute = minute < 10 ? ('0' + minute) : minute;
        second = second < 10 ? ('0' + second) : second;
        return y + '-' + m + '-' + d+' '+h+':'+minute+':'+second;
    };

    $('#input_message').textbox({
        multiline:true
    })

    $('#dg').datagrid({
        url:'/push/messages',
        pagination : true,//分页控件
        pageList: [10, 20, 30, 40, 50],
        fit: true,   //自适应大小
        border:false,
        nowrap: true,//数据长度超出列宽时将会自动截取。
        rownumbers:true,//行号
        fitColumns:true,//自动使列适应表格宽度以防止出现水平滚动。
        columns:[[

            {field:'createTime',title:'发送时间',width:120,formatter: function(value,row,index){
                return formatDateTime(value);
            }},
            {field:'pushContent',title:'消息内容',width:100},
            {field:'pushType',title:'消息类型',width:100,formatter: function(value,row,index){
                return "全员";
            }},
            {field:'pushUserId',title:'发送人',width:100},
            {field:'arrived',title:'到达用户数',width:50},
            {field:'haveRead',title:'已读用户数',width:50}

        ]]
    });

    $("#btn_send").on('click', function(){
        var pushUserId = 1000;
        var pushContent = $('#input_message').textbox('getValue');
        var url =  "/push/messages";
        $.ajax({
            type: "POST",
            url: url,
            data:{pushUserId:pushUserId, pushContent:pushContent},
            success: function(data){
                console.info(data);
                if(data.code == 1000){
                    $('#dg').datagrid('reload');
                    //location.replace(location.href);
                }
            }
        });
    })
</script>
</html>